<template>
  <div>
    <!-- 绑定 自定义事件  -->
    <BaseModal :aaa="show" @ddddd="onClose" ref="uuu"></BaseModal>

    <!-- 获取dom元素 -->
    <h1 ref="hhh">大标题</h1>

    <button @click="getget">获取数据</button>
  </div>
</template>

<script>
import BaseModal from "@/components/BaseModal.vue";
export default {
  data() {
    return {
      show: true,
    };
  },
  components: { BaseModal },
  methods: {
    onClose(hide) {
      this.show = hide;
    },
    getget() {
      // 通过ref来获取 dom元素
      // console.log(this.$refs.hhh);
      console.log(this.$refs.uuu);
      // =======  js对象灵活访问属性写法
      const formName = "uuu";

      console.log(this.$refs["uuu"]);
      console.log(this.$refs[formName]);
    },
  },
};
</script>

<style></style>
